<div ng-switch="messageDialog.show">
  <div ng-switch-when="false">
    <div class="row-fluid">
      <div class="gridStyle" ng-grid="gridOptions"></div>
      <!--
          <div class="gridStyle" hawtio-datatable="gridOptions"></div>
      -->
    </div>
  </div>
  <div ng-switch-when="true">
    <div class="row-fluid">
      <div class="span8">
        <h4>{{row.id}}</h4>
      </div>
      <div class="pull-right">
        <form class="form-horizontal no-bottom-margin">
          <div class="btn-group" hawtio-pager="messages" on-index-change="selectRowIndex" row-index="rowIndex"></div>
          <button class="btn" ng-click="messageDialog.close()" title="Closes the message detail view">
            <i class="icon-eject"></i></button>
        </form>
      </div>
    </div>
    <div class="row-fluid">
      <div class="expandable closed">
        <div title="Headers" class="title">
          <i class="expandable-indicator"></i> Headers
        </div>
        <div class="expandable-body well">
          <table class="table table-condensed table-striped">
            <thead>
            <tr>
              <th>Header</th>
              <th>Type</th>
              <th>Value</th>
            </tr>
            </thead>
            <tbody ng-bind-html-unsafe="row.headerHtml">
            </tbody>
          </table>
        </div>
      </div>

      <div class="row-fluid">
        <div title="Body" class="title">
          Body (type: {{row.bodyType}})
        </div>
        <div hawtio-editor="row.body" read-only="true" mode="mode" text-title="row.bodyType"></div>
      </div>

    </div>
  </div>
</div>
